<template>
  <view class="yh-page">
	<view class="page">
		<view class="yh-title">微信登录:用于测试微信公众号通过微信登录注册</view>
		<br/>
		<view class="uni-column">
			<view class="yh-title">微信登录-授权同时,注册登录</view>
			<button type="primary" @tap="handleToLoginByWechat()">微信登录</button>
		</view>
		<br/>
		<hr/>
		<br/>
		<view class="uni-column">
			<view class="yh-title">先执行登录,在登录状态下,测试微信绑定授权</view>
			<view class="yh-title">为了调试方便,开发环境下,可以直接用用户id登录</view>
		</view>
		<view class="uni-form-item uni-column">
			<view class="title"><text class="red">*</text>用户id</view>
			<view class="uni-input-wrapper">
				<input class="uni-input" name="user_id" v-model="user_id" placeholder="请输入用户id"  @input="inputClearUserIdInput" />
				<text class="uni-icon" v-if="showClearUserIdIcon" @tap="handleToClearUserIdIcon">&#xe434;</text>
			</view>
			<button type="primary" @tap="handleToLoginByUserId()">执行登录</button>
		</view>
		<br/>
		<view class="uni-column">
			<view class="yh-title">授权绑定-用户登录,仅微信授权</view>
			<button type="primary" @tap="handleToAgreeBindWechat()">绑定微信</button>
		</view>
	</view>
  </view>
</template>

<script>
import { toGetCodeUrl,authToLoginByCode,toGetCodeUrlWithLogin,authToLoginByCodeWithLogin,loginByUserId}  from '@/api/test/login/wechat-login.js'
import { validNumber } from '@/utils/validate'
import { isWechat }  from '@/utils/wechat';
import setting from '@/config/setting';
import store from '@/store';
export default 
{
  //计算属性
  computed:
  {

  },
  //监听
  watch:
  {

  },
  data() 
  {
    return{
		//是否在微信环境下
		isWechat:false,
		user_id:null,
		showClearUserIdIcon:false
    };
  },
  //页面加载
  onLoad(options) 
  {
	this.isWechat = isWechat()
	console.log(setting.VUE_APP_PHONE_URL)
	
	console.log(options)
	
	if(options && options.code && options.state)
	{
		const {code,state} = options
		
		// 20注册登录
		if(state == 20)
		{
			this.toAuthToLoginByCode(options)
		}
		
		// 10微信授权 
		if(state == 10)
		{
			this.toAuthToLoginByCodeWithLogin(options)
		}
	}
  },
  //页面显示
  onShow(options) 
  {

  },
  //页面初次渲染完成
  onReady()
  {

  },
  //页面隐藏
  onHide()
  {

  },
  //页面卸载
  onUnload()
  {

  },
  methods:
  {
	//微信登录
	handleToLoginByWechat()
	{
		if(!this.isWechat)
		{
			uni.showToast({
				image: "/static/test/notice/03-warning.png",
				title: "不在微信",
				mask:true,
				duration:2000
			})
			
			return 
		}
		console.log('微信登录')
		const param = {}
		param['scope_type'] = 20
		param['state'] = 20
		param['auth_redirect_url'] = setting.VUE_APP_PHONE_URL+"/pages/Test/V1/tabBar/wechat-auth/wechat-auth"
		toGetCodeUrl(param).then(res =>{
			console.log(res)
			if(res && res.code === 0)
			{
				const {data} = res
				const {url} = data
				window.location.href = url
			}
		})
	},
	inputClearUserIdInput() 
	{
	    if (this.user_id.length > 0) 
		{
	        this.showClearUserIdIcon = true;
	    } 
		else 
		{
	        this.showClearUserIdIcon = false;
	    }
	},
	handleToClearUserIdIcon() 
	{
	    this.inputUserId = null;
		this.user_id = null;
	    this.showClearUserIdIcon = false;
	},
	//用户id登录
	async handleToLoginByUserId()
	{
		let validatedNumber =  validNumber(this.user_id)
		
		if(!validatedNumber)
		{
			uni.showToast({
				image: "/static/test/notice/04-error.png",
				title: "必须是数字",
				mask:true,
				duration:2000
			})
			
			return 
		}
		
		let _this = this
		let param = {}
		param['user_id'] = this.user_id
		const result = await loginByUserId(param).then(res=>
		{
			return new Promise((resolve,reject)=>{
				if(res && res.code == 0)
				{
					
					resolve(res.data)
				}
			})
		})
		const {token} = result
		_this.$store.dispatch('user/loginSaveToken',token)
	},
	//同意绑定微信
	handleToAgreeBindWechat()
	{
		if(!this.isWechat)
		{
			uni.showToast({
				image: "/static/test/notice/03-warning.png",
				title: "不在微信",
				mask:true,
				duration:2000
			})
			
			return 
		}
		console.log(this.$store.getters.token)
		if(!this.$store.getters.token)
		{
			uni.showToast({
				image: "/static/test/notice/04-error.png",
				title: "未登录",
				mask:true,
				duration:2000
			})
			
			return 
		}
		console.log('绑定微信')
		const param = {}
		param['scope_type'] = 20
		param['state'] = 10
		param['auth_redirect_url'] = setting.VUE_APP_PHONE_URL+"/pages/Test/V1/tabBar/wechat-auth/wechat-auth"
		
		toGetCodeUrlWithLogin(param).then(res =>
		{
			console.log(res)
			if(res && res.code === 0)
			{
				const {data} = res
				const {url} = data
				window.location.href = url
			}
		})
	},
	//通过code授权登录
	async toAuthToLoginByCode(options)
	{
		const result =  await authToLoginByCode(options).then(res=>{
			
			return new Promise((resolve,reject)=>{
				if(res && res.code == 0)
				{
					resolve(res.data)
				}
			})
		})
		
		const { token, openid } = result
		
		if(token)
		{
			_this.$store.dispatch('user/loginSaveToken',token)
			
			if(openid)
			{
				_this.$store.dispatch('user/authSaveOpenid',openid)
			}
		}
	},
	//通过code授权绑定
	async toAuthToLoginByCodeWithLogin(options)
	{
		
		let _this = this
		const result =  await authToLoginByCodeWithLogin(options).then(res=>{
			
			return new Promise((resolve,reject)=>{
				if(res && res.code == 0)
				{
					resolve(res.data)
				}
			})
		})
		//console.log(result)
		const {openid} = result
		_this.$store.dispatch('user/authSaveOpenid',openid)
	}
  }

}
</script>

<style lang="scss" scoped>
.page{
	width:calc(100% - 70rpx);
	padding:35rpx;
}
.title {
        padding: 5rpx 13rpx;
    }

.uni-input-wrapper {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	flex-wrap: nowrap;
	background-color: #FFFFFF;
}

.uni-input {
	height: 80rpx;
	line-height: 80rpx;
	font-size: 36rpx;
	padding: 0rpx;
	flex: 1;
	background-color: #FFFFFF;
}

.uni-icon {
	font-family: uniicons;
	font-size: 80rpx;
	font-weight: normal;
	font-style: normal;
	width: 80rpx;
	height: 80rpx;
	line-height: 80rpx;
	color: #999999;
}

.uni-eye-active {
	color: #007AFF;
}

.red{
	color:red;
	font-weight: true;
}
</style>
